import { defineStore } from "pinia";
import { computed, ref } from "vue";
import type { ComputedRef, Ref } from "vue";
import { fetchCommentListAPI, fetchEvaluateInfoAPI, fetchGoodDetailAPI, fetchHotListAPI, fetchRelevantListAPI } from "@/api/detailApi/detailApi.ts";
import type { Categorie, Comment, CommentInfo, CommentPageParams, GoodDetail, Sku, Spec } from "@/types/detailTypes/detailTypes.ts";
import type { DetailStoreInterface } from "@/pinia/modules/detailStore/interface.ts";
import type { Good } from "@/types/homeTypes/homeTypes.ts";


const useDetailStore = defineStore("detailStore", (): DetailStoreInterface => {
   /*详情*/
   const goodDetail: Ref<GoodDetail> = ref<GoodDetail>({} as GoodDetail);
   /*面包屑*/
   const categories: ComputedRef<Categorie[]> = computed<Categorie[]>(() => goodDetail?.value?.categories);
   /*名称*/
   const name: ComputedRef<string> = computed<string>(() => goodDetail?.value?.name);
   /*zoom图片*/
   const mainPictures: ComputedRef<string[]> = computed<string[]>(() => goodDetail?.value?.mainPictures);
   /*规格*/
   const specs: ComputedRef<Spec[]> = computed<Spec[]>(() => goodDetail?.value?.specs);
   /*sku集合*/
   const skus: ComputedRef<Sku[]> = computed<Sku[]>(() => goodDetail?.value?.skus);
   /*同类推荐或者猜你喜欢列表*/
   const relevantList: Ref<any[]> = ref<any[]>([]);
   /*热销推荐*/
   const hotList: Ref<Good[]> = ref<Good[]>([]);
   /*商品评价信息*/
   const evaluateInfo: Ref<CommentInfo> = ref<CommentInfo>({} as CommentInfo);
   /*评价列表*/
   const commentList: Ref<Comment> = ref<Comment>({} as Comment);
   /*获取商品详情的请求函数*/
   const fetchGoodDetail = async (id: string): Promise<void> => {
      const { result }: { result: GoodDetail } = await fetchGoodDetailAPI(id);
      goodDetail.value = result;
   };
   /*获取省市区的请求函数*/
   const fetchCityData = async (): Promise<any[]> => {
      if (window.cityData) {
         return window.cityData;
      } else {
         const response: Response = await fetch("https://yjy-oss-files.oss-cn-zhangjiakou.aliyuncs.com/tuxian/area.json");
         const cityData: any[] = await response.json();
         window.cityData = cityData;
         return cityData;
      }
   };
   /*获取同类推荐或者猜你喜欢的请求函数*/
   const fetchRelevantList = async (id: string | undefined, limit: number): Promise<void> => {
      const { result }: { result: Good[] } = await fetchRelevantListAPI((id as string), limit);
      const size: number = 4;
      const total: number = Math.ceil(result.length / size);
      for (let i: number = 0; i < total; i++) {
         relevantList.value.push(result.slice(i * size, (i + 1) * size));
      }
   };
   /*获取热销推荐的请求函数*/
   const fetchHotList = async (id: string, limit: number, type: number): Promise<void> => {
      const { result }: { result: Good[] } = await fetchHotListAPI(id, limit, type);
      hotList.value = result;
   };
   /*获取商品评价信息的请求函数*/
   const fetchEvaluateInfo = async (id: string): Promise<void> => {
      const { result }: { result: CommentInfo } = await fetchEvaluateInfoAPI(id);
      result.tags.unshift({ title: "有图", tagCount: result.hasPictureCount });
      result.tags.unshift({ title: "全部评价", tagCount: result.evaluateCount });
      evaluateInfo.value = result;
   };
   /*获取商品评价列表的请求函数*/
   const fetchCommentList = async (id: string, params: CommentPageParams): Promise<void> => {
      const { result }: { result: Comment } = await fetchCommentListAPI(id, params);
      commentList.value = result;
   };
   return {
      goodDetail,
      categories,
      name,
      mainPictures,
      specs,
      skus,
      relevantList,
      hotList,
      evaluateInfo,
      commentList,
      fetchGoodDetail,
      fetchCityData,
      fetchRelevantList,
      fetchHotList,
      fetchEvaluateInfo,
      fetchCommentList,
   };
});

export default useDetailStore;
